/**
 * title: 修改手机号
 */
import React, { Component } from 'react';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import CheckPhone from './components/CheckPhone';
import ResetPhone from './components/ResetPhone';
import EditBox from '../components/EditBox';
import Result from './components/Result';

const steps = [
  {
    title: '修改手机号',
    description: '您正在尝试修改绑定手机，为了确保您的账号安全，修改绑定手机需要进行安全验证，请按照提示完成操作。',
    component: CheckPhone,
  },
  {
    title: '修改手机号',
    description: '您正在尝试修改绑定手机，为了确保您的账号安全，修改绑定手机需要进行安全验证，请按照提示完成操作。',
    component: ResetPhone,
  },
  {
    title: '',
    description: '',
    component: Result,
  },
];

class EditPhoneWrapper extends Component {
  state = {
    success: false,
    current: 0,
    oldCode :'',
  };
  changeCurrent = (current,oldCode) => {
    this.setState({ current,oldCode });
  };
  render() {
    const { current,oldCode} = this.state;
    const StepComponent = steps[current].component;
    return (
      <PageHeaderWrapper
        title="修改手机号"
      >
        <EditBox title={steps[current].title} description={steps[current].description} >
          <StepComponent changeCurrent={this.changeCurrent}  oldCode = {oldCode}/>
        </EditBox>
      </PageHeaderWrapper>
    );
  }
}
export default EditPhoneWrapper;
